@import '../button/index.scss';
@import '../swipe/index.scss';

.nut-theme-dark {
  .nut-address-list {
    &-swipe,
    &-general {
      background-color: $dark-background2;
      border-bottom: 1px solid $dark-color-gray;
      color: $dark-color;
      &__mask {
        background-color: $dark-color3;
        &-copy {
          color: $dark-color-gray;
          background-color: $dark-color;
        }
      }
    }
    &-item {
      &__addr {
        color: $dark-color-gray;
      }
    }
    &__bottom {
      background-color: $dark-background2;
    }
  }
}
.nut-address-list {
  overflow: hidden;
  &:last-child {
    padding-bottom: 84px;
  }
  &-swipe,
  &-general {
    min-height: 76px;
    padding: 5px 10px;
    background-color: $addresslist-bg;
    border-bottom: 1px solid $addresslist-border;
    color: $addresslist-font-color;
    font-size: $addresslist-font-size;
    display: flex;
    align-items: center;
    position: relative;
    &__mask {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      background-color: $addresslist-mask-bg;
      display: flex;
      justify-content: space-around;
      align-items: center;
      padding: 0 40px;
      z-index: 2001;
      &-copy,
      &-set,
      &-del {
        height: 55px;
        width: 55px;
        padding: 0 10px;
        border-radius: 50%;
        text-align: center;
        background-color: $white;
        font-size: 14px;
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;
      }
      &-set {
        color: $white;
        background-color: $addresslist-set-bg;
      }
      &-del {
        color: $white;
        background-color: $addresslist-del-bg;
      }
    }
  }
  &-general {
    &:last-child {
      border-bottom: none;
    }
  }
  .nut-swipe {
    &:last-of-type {
      .nut-address-list-swipe {
        border-bottom: none;
      }
    }
  }
  &-item {
    width: 100%;
    &__info {
      display: flex;
      justify-content: space-between;
      &-contact {
        display: flex;
        justify-content: flex-start;
        font-weight: bold;
        align-items: center;
        &-name {
          max-width: 145px;
          word-wrap: break-word;
        }
        &-tel {
          margin-left: 8px;
          max-width: 110px;
          word-wrap: break-word;
        }
        &-default {
          margin-left: 5px;
          padding: 0 6px;
          height: 16px;
          line-height: 16px;
          background: $addresslist-contnts-contact-default;
          border-radius: 2px;
          font-size: 12px;
          color: $addresslist-contnts-contact-color;
        }
      }
      &-handle {
        &-edit {
          margin-left: 15px;
        }
      }
    }
    &__addr {
      color: $addresslist-addr-font-color;
      font-size: $addresslist-addr-font-size;
      margin-top: 5px;
    }
  }
  &__bottom {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    bottom: constant(safe-area-inset-bottom);
    bottom: env(safe-area-inset-bottom);
    width: 100%;
    padding: 12px 18px 24px;
    z-index: 100000;
    background-color: $addresslist-bg;
    box-sizing: border-box;
  }
  .nut-address-list__mask-bottom {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    background-color: transparent;
  }
}
